<template>
  <div>
    <!-- {{ $route.name }} -->
   <feerule v-if="$route.path === '/fee_rule'"/> 
   <cancelrule v-else-if="$route.path === '/cancel_rule'">
   </cancelrule>
   <profitsharingrule v-else-if="$route.path === '/profitsharingrule'"></profitsharingrule>
   <rewardrule v-else></rewardrule>
  </div>
</template>

<script>
import Cancelrule from './cancelrule.vue';
import feerule from "./feerule";
import Profitsharingrule from './profitsharingrule.vue';
import Rewardrule from './rewardrule.vue';
export default {
  components: {
    feerule,
    Cancelrule,
    Profitsharingrule,
    Rewardrule,
  },
  name: "rule",
  data() {
    return {
      msg: "Welcome to Your Vue.js App",
    };
  },
  methods: {
    handleClick() {
      console.log("click");
    },
  },
    // 添加一个计算属性用来显示这个路由内容
    watch: {
      $route(newValue, oldValue) {
            //  在这地方监听到这个不同的路由
            console.log(newValue);
            
      }
    },
    
};
</script>

<style>
</style>